<template>
  <VPrint ref="printRef" id="printPay" :title="form.template_name" font-size="12" width="1200px">
    <component :is="com" v-model="form" isLook />
  </VPrint>
</template>

<script setup>
import api from '../../api'
import Template1 from './Template1'
import Template2 from './Template2'
import Template3 from './Template3'
import VPrint from '@/components/VPrint'

const type = ref()
const com = computed(() => ['', Template1, Template2, Template3][type.value])

const form = ref({})
const printRef = ref()
const getForm = async (row) => {
  const {c_id, doc_type} = row
  type.value = doc_type
  const res = await api.printDetail({ c_id })
  form.value = res.data
  await nextTick()
}
const view = async (row) => {
  await getForm(row)
  printRef?.value.view()
}
const print = async (row) => {
  await getForm(row)
  printRef?.value.print()
}
const pdf = async (row) => {
  await getForm(row)
  printRef?.value.pdf(form.value.template_name)
}

defineExpose({ view, print, pdf })
</script>